import 'package:flutter/material.dart';

import 'package:get/get.dart';

import '../controllers/register_step_two_controller.dart';
import '../../../../common/widget/logo.dart';
import '../../../../utils/screenAdapter.dart';
import 'package:pin_code_fields/pin_code_fields.dart';
import '../../../../common/widget/codeButton.dart';

class RegisterStepTwoView extends GetView<RegisterStepTwoController> {
  const RegisterStepTwoView({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('手机号快速注册'),
        // centerTitle: true,
      ),
      body: ListView(
        padding: EdgeInsets.fromLTRB(
          ScreenAdapter.width(30),
          ScreenAdapter.height(120),
          ScreenAdapter.width(30),
          ScreenAdapter.height(30),
        ),
        children: [
          Logo(),
          SizedBox(height: ScreenAdapter.height(50)),
          Column(
            children: [
              Text("请输入验证码", style: TextStyle(fontWeight: FontWeight.bold)),
              SizedBox(height: ScreenAdapter.height(20)),
              Text("已发送至+86 ${controller.tel}"),
            ],
          ),
          SizedBox(height: ScreenAdapter.height(100)),
          PinCodeTextField(
            pastedTextStyle: TextStyle(color: Colors.black),
            autoFocus: true,
            keyboardType: TextInputType.number,
            appContext: context,
            length: 6,
            obscureText: false,
            animationType: AnimationType.fade,
            pinTheme: PinTheme(
              shape: PinCodeFieldShape.box, // 验证码输入框的形状样式
              borderRadius: BorderRadius.circular(5),
              fieldHeight: 50,
              fieldWidth: 40,
              // 边框颜色
              activeColor: Colors.orange,
              inactiveColor: Colors.black12,
              selectedColor: Colors.orange,
              // 格子的背景颜色
              activeFillColor: Colors.white,
              inactiveFillColor: Colors.white,
              selectedFillColor: Colors.orange,
            ),
            dialogConfig: DialogConfig(
              affirmativeText: '确定',
              negativeText: '取消',
              dialogTitle: '提示',
              dialogContent: "确定黏贴",
            ), // 黏贴对话框配置
            animationDuration: Duration(milliseconds: 300),
            enableActiveFill: true,
            controller: controller.firstField,
            onCompleted: (v) {
              print("Completed==$v");
            },
            onChanged: (value) {
              print(value);
            },
            beforeTextPaste: (text) {
              print("Allowing to paste $text");
              //if you return true then it will show the paste confirmation dialog. Otherwise if false, then nothing will happen.
              //but you can show anything you want here, like your pop up saying wrong paste format or etc
              return true;
            },
          ),
          SizedBox(height: ScreenAdapter.height(20)),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Obx(
                () => TextButton(
                  style: ButtonStyle(
                    padding: WidgetStateProperty.all(EdgeInsets.zero),
                  ), // 默认去掉按钮的padding
                  onPressed: () {},
                  child: controller.seconds.value == 0
                      ? InkWell(
                          onTap: () {
                            // 重新发送
                            controller.sendCode(controller.tel);
                          },
                          child: Text(
                            "重新发送",
                            style: TextStyle(color: Colors.black54),
                          ),
                        )
                      : Text(
                          "重新发送(${controller.seconds.value})",
                          style: TextStyle(color: Colors.black54),
                        ),
                ),
              ),
              TextButton(
                style: ButtonStyle(
                  padding: WidgetStateProperty.all(EdgeInsets.zero),
                ),
                onPressed: () {
                  Get.toNamed("/pass-login");
                },
                child: Text("获取帮助", style: TextStyle(color: Colors.blue)),
              ),
            ],
          ),
          SizedBox(height: ScreenAdapter.height(40)),
          CodeButton(
            textContent: "下一步",
            onPressed: () async {
              FocusScope.of(context).requestFocus(FocusNode()); // 隐藏键盘
              if (controller.firstField.text.length < 6) {
                Get.snackbar("提示", "请输入正确的验证码");
                return;
              }
              bool success = await controller.validateCode();
              if (success) {
                Get.toNamed(
                  "/register-step-three",
                  arguments: {
                    "tel": controller.tel,
                    "code": controller.firstField.text,
                  },
                );
              } else {
                Get.snackbar("提示", "验证码错误");
              }
            },
          ),
        ],
      ),
    );
  }
}
